// JavaScript Document
//定义星星的x、y坐标的最大值和最小值
var y_top = 0;
var y_bottom = 0;
var x_left = 0;
var x_right =0;
//设置星星最大和最小宽度
var img_width_max=80;
var img_width_min =10;
function start(){//随机输出星星
	//创建img节点
	var img = document.createElement("img");
	//在body中增加img标签
	document.body.appendChild(img);
	//为img节点增加src属性
	img.src="images/star.gif";
	
	//随机获取星星的宽度
	var width = getRandom(img_width_max,img_width_min);
	//随机获取星星在可视区域的x和y坐标
	var x = getRandom(x_left,x_right);
	var y = getRandom(y_top,y_bottom);
	//为星星设计css样式
	img.style.position="absolute";//绝对坐标
	img.style.transition="all .5s";//0.5s渐变动画
	img.style.width=width+"px";//宽度
	img.style.left=x+"px";
	img.style.top=y+"px";//坐标
	img.style.opacity="0";//初始为全透明
	img.addEventListener("mouseenter",function(){waithide(img);},{ once: true });//当鼠标移动到星星时，星星消失
	setTimeout(function(){img.style.opacity=1;}, 100);//0.1s后，0.5s渐变出现
	var currentTime=new Date().getTime();//获取当前时间ms
	img.dataset.time=currentTime;//设置星星放置时间
	//定期清理星星
	var sts=document.getElementsByTagName("img");
	for(star of sts){
		if(star.src&&star.src.endsWith("images/star.gif")){
			if(currentTime-star.dataset.time>=20000)//选出10秒前放的星星
				waithide(star);//移除星星
		}
	}
}
function init(){//获取满天星
	
	//设置网页背景色
	document.body.bgColor="#000";
	//获取星星在可视区域的最大的宽度和高度
	 x_right = window.innerWidth-img_width_max;
	 y_bottom = window.innerHeight-img_width_max;
	//定时器：每1秒执行1次
	setInterval(start,1000);
}
function waithide(obj)//隐藏星星，0.5s动画
{
  obj.style.opacity = '0';//设置透明度为0
  setTimeout(function(){obj.remove();}, 500);//0.5s后移除目标对象
}
function getRandom(max,min){//随机获取范围内数值
	return Math.floor(Math.random()*(max - min)+min);
}
document.addEventListener("touchstart", function () {
    var allVideos = document.querySelectorAll('video');
    for (var i = 0; i < allVideos.length; i++) {
        allVideos[i].play();
    }
},{ once: true });
document.addEventListener("click", function () {
    var allVideos = document.querySelectorAll('video');
    for (var i = 0; i < allVideos.length; i++) {
        allVideos[i].play();
    }
},{ once: true });

